//map.scss
@import "quote.scss";

.map {
    .header {
        height: 120px;

        .h_back {
            left: 30px;
            top: 20px;
            width: 80px;
            height: 80px;
            background: $colorWhite;
        }

        .h_link {
            right: 30px;
            top: 15px;
            width: 30px;
            height: 30px;
            padding: 30px;
            margin-right: -30px;
        }
    }

    .h_title {
        text-align: left;
        white-space: normal;
        padding: 0 130px;
    }


    .title {
        line-height: 50px;
        margin-top: 15px;
        font-size: 34px;

        .position {
            font-size: 28px;
        }

        img {
            height: 24px;
            margin-left: 10px;
        }
    }

    .content {
        line-height: 30px;
        font-size: 24px;
        @extend .text-els;

        .address {
            margin-left: 10px;
        }
    }
    .location {
        position: fixed;
        bottom: 100px;
        right: 40px;
        width: 120px;
        height: 120px;
        z-index: 1;

        .locationBg {
            width: 100%;
            height: 100%;
            background: url("../Img/icon/location.png") no-repeat center/120px;
        }
        .locationBg.ing {
            background: url("../Img/icon/inPositioning.png") no-repeat center/120px;
        }
        .locationLoading {
            width: 100%;
            height: 100%;
            background: url("../Img/icon/locationLoading.png") no-repeat center/120px;
            position: absolute;
            top: 0;
            z-index: 1;
            -webkit-animation:circle 2000ms infinite linear;
        }
        @-webkit-keyframes circle{
            0%{ transform:rotate(0deg); }
            100%{ transform:rotate(360deg); }
        }
    }
    //#container {
    //    width: 100%;
    //    height: 100%;
    //    position: absolute;
    //    bottom: 0;
    //    overflow: hidden;
    //    margin: 0;
    //}
    //.headBgImg {
    //    width: 169px;
    //    height: 207px;
    //    margin: -130px 0 0 -66px;
    //    position: absolute;
    //}
    //.headImg {
    //    width: 144px;
    //    height: 144px;
    //    margin: -116px 0 0 -54px;
    //    position: absolute;
    //}

}
